import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

Item {
    property string title: ""
    property var options: []

    width: parent.width
    height: contentCol.height + 10

    Rectangle {
        anchors.fill: parent
        color: "#ffffff"
        radius: 8
        border.width: 0
    }

    ColumnLayout {
        id: contentCol
        anchors.fill: parent
        anchors.margins: 10
        spacing: 10

        Text {
            text: title
            font.pixelSize: 14
            color: "#333333"
        }

        RowLayout {
            spacing: 40
            Repeater {
                model: options
                delegate: CheckBox {
                    text: modelData.text
                    checked: modelData.checked
                    font.pixelSize: 12
                    //color: "#666666"
                    indicator: Rectangle {
                        width: 16
                        height: 16
                        border.width: 1
                        border.color: "#cccccc"
                        radius: 3
                        Rectangle {
                            width: 10
                            height: 10
                            color: parent.checked ? "#0078d7" : "transparent"
                            anchors.centerIn: parent
                            radius: 2
                        }
                    }
                }
            }
        }
    }
}
